"use strict";
import * as React from 'react';
import { commonProps, commonStyles } from "../../assets/styles/common";
import NavBackButton from "../../component/BackButton";
import Colors from "../../assets/styles/Colors";
import { NAVBAR_HEIFHT, patchPostMessageJsCode } from "../../constant";
import NavRightButton from "../../component/RightButton";
import T from "../../utils/T";
import { openUrl } from "../../utils/tools";
import MyText from "../../component/MyText";
const { Actions } = require("react-native-router-flux");
const { View, WebView } = require('react-native');
const { connect } = require('react-redux');
const NavigationBar = require('react-native-navbar').default;
const { ActionSheet } = require('antd-mobile');
class Page extends React.Component {
    constructor() {
        super(...arguments);
        this.state = {
            title: '加载中...',
            canGoBack: false,
            canGoForward: false,
            jsEvaluationValue: '',
            loading: false,
            url: ''
        };
        this.onBack = () => {
            if (this.state.canGoBack) {
                this.web.goBack();
            }
            else {
                Actions.pop();
            }
        };
        this.onLoadEnd = ({ nativeEvent }) => {
            this.setState(Object.assign({}, nativeEvent));
        };
        this.onNavigationStateChange = (nativeEvent) => {
            this.setState(Object.assign({}, nativeEvent));
        };
        this.onMorePress = () => {
            ActionSheet.showActionSheetWithOptions({
                options: [T('refresh'), T('open in Safari'), T('cancel'),],
                cancelButtonIndex: 2,
                destructiveButtonIndex: 1,
                maskClosable: true,
            }, (buttonIndex) => {
                if (buttonIndex === 0) {
                    this.web.reload();
                }
                if (buttonIndex === 1) {
                    if (this.state.url) {
                        openUrl(this.state.url, false);
                    }
                    else {
                    }
                }
            });
        };
        this.onMessage = (e) => {
        };
        this.onShouldStartLoadWithRequest = (e) => {
            if (e.url.indexOf('http') !== -1) {
                return true;
            }
            else {
                openUrl(e.url);
                return false;
            }
        };
        this.getSource = () => {
            let source = null;
            if (typeof this.props.source === 'string') {
                source = { uri: this.props.source };
            }
            else {
                source = this.props.source;
            }
            console.log('source= ', source);
            return source;
        };
    }
    componentWillMount() {
    }
    render() {
        return (<View style={commonStyles.container}>
                <NavigationBar {...commonProps.navBar} rightButton={<NavRightButton onPress={this.onMorePress}>
                                   更多
                               </NavRightButton>} leftButton={<NavBackButton onPress={this.onBack}/>} title={<View style={[commonStyles.centerVH, commonStyles.flex1, { height: NAVBAR_HEIFHT - 12, paddingRight: 5 }]}><MyText numberOfLines={1} color={Colors.White} fontSize={16}>{this.state.title}</MyText></View>}/>
                <WebView style={[{ display: 'flex', flex: 1 }]} injectedJavaScript={patchPostMessageJsCode} javaScriptEnabled domStorageEnabled onNavigationStateChange={this.onNavigationStateChange} onMessage={this.onMessage} onShouldStartLoadWithRequest={this.onShouldStartLoadWithRequest} onLoadEnd={this.onLoadEnd.bind(this)} ref={web => this.web = web} source={this.getSource()}/>
            </View>);
    }
}
export default Page;
